<template>
	<view class="item-main">
	<!-- 	<view class="item-top">
			<span class='left' style="width: 60%;"><text v-if="item.storeCategoryName">{{item.storeCategoryName}}<text
						style="margin: 0 10rpx  ;">|</text></text></text> {{ item.title }}</span>

			<template v-if="item.isReward==2">
				<span class='right' @click="publish " style="margin-right: 3px;">发布悬赏</span>
			</template>
			<template v-else>
				<span class='right' @click="publish" style="margin-right: 3px;">修改悬赏</span>
				<template v-if="item.rewardStatus == 1">
					<span class='right' @click="setReward(0)" style="margin-right: 3px;">打开悬赏</span>
					<span class='right' v-if="item.trusteeship !='1'" @click="deleteReward" style="margin-right: 3px;">删除悬赏</span>
				</template>
				<template v-else>
					<span class='right' @click="setReward(1)" style="margin-right: 3px;">关闭悬赏</span>
				</template>
			</template>
			<span class='right rt' @click="$emit('tgMeth',item.rewardId)"
				v-if="item.status == 0&&item.isReward == '1' &&item.trusteeship !='1'">立即托管</span>
		</view> -->
		<rewaredComp :item="item" :rewardType="item.status==1?8:0" @tgMeth="rewardId=>$emit('tgMeth',rewardId)" @updateItem ="(k,v)=>$emit('updateItem', k, v)" />
		<view class="item-center"
			@click="toPage('/pages/details/shopRent/shopRent?mind=1&id='+item.id+'&st='+item.status+'&storeCategory='+item.storeCategory)"
			style="flex-wrap: nowrap;">
			<view class="acea-row" style="flex-wrap: nowrap;">
				<img class='item-img' :src="toImage(item)" alt="">
				<view class="content-main" v-if="item.status == 1">
					<p>面积：{{ item.avea || 0 }}㎡</p>
					<p>单价：{{ item.salemoney  || 0 }}元/㎡</p>
					<p v-if="item.sellOunt">总价：{{ item.sellOunt/10000}}万元</p>
					<p>投资回报率：{{ item.returnInvestment || 0 }}%</p>
				</view>
				<view class="content-main" v-else>
					<p>面积：{{ item.avea || 0 }}㎡</p>
					<p>租金：{{ item.rent || 0 }}元/月</p>
					<p>转让费：{{ item.transferFee  || 0 }}万</p>
					<p>适合行业：{{ item.workingGroupName || '' }}</p>
				</view>
			</view>
			<view class="center-right" style="min-width: 100rpx;text-align: right: ;;">
				{{ item.isUp == 0 ? '上线' : ( item.isUp == 1 ? '下线' : '成交') }}
			</view>
		</view>
		<view class="item-bottom">
			<p>已为您匹配到{{item.matchingNum?item.matchingNum:0}}人·浏览 {{item.view?item.view:0}} ·咨询
				{{item.communication?item.communication:0}}
			</p>
			<view class="bottom-btn">
				<text
					@click="item.sort != '1'?$emit('to-topping',item.id,'jy',item.storeCategory,item.status):null">{{item.sort == '1'?'已置顶':'置顶'}}</text>
				<text>群发</text>
				<text @click="$emit('toVip',item)" :class="item.isVip== 1?'vip':''">
					{{item.isVip == '1'?'VIP信息':'VIP'}}</text>
				<text @click="$emit('visitor',item)">访客</text>
				<text @click="jumpPage">编辑</text>
				<text @click="$emit('setMeth',item)">设置</text>
			</view>
		</view>
		<!-- 		<u-modal :show="show" @confirm="Topping" @close="show = false" ref="uModal" :closeOnClickOverlay="true">
			<view style="width: 100%;">
				  <view class="chooseBox">
				  	<u-checkbox-group v-model="checkboxValue1" placement="column" @change="checkboxChange">
				  		<u-checkbox :customStyle="{marginBottom: '30rpx'}" v-for="(item, index) in zdList" :key="index"
				  			:label="item.name" :name="item.name">
				  		</u-checkbox>
				  	</u-checkbox-group>
				  </view>
			</view>
		</u-modal> -->

	</view>
</template>

<script>
	import {
		toPage
	} from '@/filters/commFilter.js'
	import {
		closeReward,
		deleteReward
	} from '@/api/api.js'
	import rewaredComp from './publishReward/index.vue'
	export default {
		components:{
			rewaredComp
		},
		props: ['item'],
		data() {
			return {
				show: false,
				setTime: '',
				zdList: ''
			}
		},
		methods: {
			toPage,
			toImage(item) {
				let t = item.shopfrontPhoto ? item.shopfrontPhoto.split(',') : '';

				if (!t) {
					return this.$noImageShow
				}
				let sp = this.separateVideosAndImages(t);
				return sp.imageArray.length > 0 ? sp.imageArray[0] : this.$noImageShow

			},
			separateVideosAndImages(inputArray) {
				let videoArray = [];
				let imageArray = [];

				const videoExtensions = /\.(mp4|avi|mov)$/i;
				const imageExtensions = /\.(jpg|jpeg|png|gif)$/i;

				inputArray.forEach(item => {
					const extension = item.match(/\.[0-9a-z]+$/i) ? item.match(/\.[0-9a-z]+$/i)[0] : '';

					if (extension.match(videoExtensions)) {
						videoArray.push(item);
					} else if (extension.match(imageExtensions)) {
						imageArray.push(item);
					}
				});
				if (imageArray.length < 1 && videoArray.length < 1 && inputArray.length > 0) {
					imageArray = inputArray;
				}
				return {
					videoArray,
					imageArray
				};
			},
			publish() {
				// if(this.item.isReward==1){
				// 	return;
				// }
				this.item.type = 0;
				let item = JSON.stringify(this.item);
				uni.navigateTo({
					url: '/pages/releases/offeraRreward/offeraRreward?item=' + item
				})
			},
			setReward(st){
				let that = this;
				uni.showModal({
					title: '提示',
					content: '是否'+(st==1?'关闭':'打开')+'当前悬赏',
					success: function (res) {
						if (res.confirm) {
							closeReward({
								id: that.item.rewardId,
								status: st
							}).then(res=>{
								// that.item. 'rewardStatus' = st;
								that.$emit("updateItem",'rewardStatus',st)
								that.$util.Tips({
									title: (st==1?'关闭':'打开')+'悬赏成功'
								})
								// that.item.rewardStatus = st;
							})
						} else if (res.cancel) {
							// console.log('用户点击取消');
						}
					}
				});
				
			},
			deleteReward(){
				let that = this;
				uni.showModal({
					title: '提示',
					content: '是否删除当前悬赏',
					success: function (res) {
						if (res.confirm) {
							console.log("that.item.rewardId",that.item.rewardId)
							deleteReward(that.item.rewardId).then(res=>{
								// that.item. 'rewardStatus' = st;
								that.$emit("updateItem",'isReward',2)
								that.$util.Tips({
									title: '删除悬赏成功'
								})
								// that.item.rewardStatus = st;
							})
						} else if (res.cancel) {
							// console.log('用户点击取消');
						}
					}
				});
			},
			jumpPage() {
				console.log(this.item)
				let categoryOn = null;
				// let typeOn = this.item.status == '0' ? 0 : (this.item.status == '1' ? 4 : 2 );
				let enums = {
					883: 0,
					884: 1,
					1014: 2,
					911: 3,
					885: 4,
					912: 5,
					913: 6,
				}
				let jyInfo = {
					0: {
						name: '出租',
						code: 0
					},
					1: {
						name: '出售',
						code: 3
					},
					2: {
						name: '转让',
						code: 1
					}
				}

				categoryOn = enums[this.item.storeCategory];
				toPage('/pages/releases/subletOfShop/subletOfShop?categoryOn=' + categoryOn + '&typeOn=' + (jyInfo[this
						.item.status].code) + '&st=' + this.item.status + '&id=' + this.item.id + '&storeCategory=' +
					this.item.storeCategory)
			},



		}
	}
</script>

<style lang="scss">
	.item-main {
		padding-bottom: 36rpx;
		background-color: #ffffff;
		margin: 40rpx 28rpx;
		border-radius: 20rpx;
		padding: 0rpx 24rpx 0rpx 28rpx;

		.item-top {
			// margin: 0rpx 24rpx 0rpx 28rpx;
			border-bottom: 2rpx solid rgba(238, 238, 238, 1);
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 86rpx;

			.left {
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				font-size: 30rpx;
				font-weight: 400;
				width: 75%;
				color: rgba(56, 56, 56, 1);
			}

			.right {
				border-radius: 10rpx;
				background-color: rgb(238, 33, 45);
				color: rgba(255, 255, 255, 1);
				font-size: 24rpx;
				width: 20%;
				height: 44rpx;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}

		.item-center {
			display: flex;
			justify-content: space-between;
			margin-top: 36rpx;
			padding-bottom: 40rpx;
			border-bottom: 2rpx solid rgba(238, 238, 238, 1);

			.acea-row {
				display: flex;
				align-items: center;

				.item-img {
					width: 170rpx;
					height: 144rpx;
					border-radius: 10rpx;
					margin-right: 18rpx;
				}

				.content-main {
					font-size: 24rpx;
					font-weight: 400;
					line-height: 20px;
					color: rgba(128, 128, 128, 1);

					p {
						margin: 0;
						padding: 0;
					}
				}
			}

			span {
				font-size: 22rpx;
				font-weight: 400;
				color: rgba(238, 33, 45, 1);
			}
		}

		.item-bottom {
			p {
				margin-top: 20rpx;
				font-size: 22rpx;
				font-weight: 400;
				line-height: 40rpx;
				color: rgba(166, 166, 166, 1);
			}

			.bottom-btn {
				padding-bottom: 36rpx;
				margin-top: 18rpx;
				display: flex;
				justify-content: space-between;

				text {
					font-size: 24rpx;
					color: rgba(128, 128, 128, 1);
					width: 90rpx;
					line-height: 44rpx;
					border-radius: 4rpx;
					border: 2rpx solid rgba(229, 229, 229, 1);
					display: flex;
					justify-content: center;
				}
			}
		}
	}

	::v-deep .u-modal__content {
		padding: 30rpx 70rpx !important;
	}

	.chooseBox {
		width: 100%;
		padding: 20rpx 60rpx;
	}
.center-right {
				font-size: 24rpx;
				// color: rgba(238, 33, 45, 1);
			}
	.rt {
		margin-left: 20rpx;
	}

	.vip {
		border: 1px solid red !important;
		color: red !important;
	}
</style>